<template>
  <div class="coupon-wrap">
    <van-nav-bar
      title="我的优惠卷"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />
    <div class="img">
      <img src="../assets/image/discountcoupon.png" alt="" />
    </div>
    <div class="text">
      <p>暂无可用的优惠卷</p>
    </div>
    <div class="btn">
      <button @click="toInvalidCoupon">查看失效的优惠卷</button>
    </div>
  </div>
</template>

<script>
import { useRouter } from "vue-router";
export default {
  setup() {
    const router = useRouter();
    const onClickLeft = () => history.back();
    const toInvalidCoupon = () => {
      router.push("invalidcoupon");
    };
    return {
      onClickLeft,
      toInvalidCoupon,
    };
  },
};
</script>

<style lang="less" scoped>
.coupon-wrap {
  .img {
    padding: 14% 10% 10% 5%;
  }
  .text {
    p {
      font-size: 17px;
      text-align: center;
      color: #333;
    }
  }
  .btn {
    button {
      color: #333 !important;
      background-color: #f6f7f9;
      margin-top: 191px;
      width: 100% !important;
      height: 55px;
      border: 0;
      font-size: 15px;
    }
  }
}
</style>